<template>
  <div>
    <div class="app" @mousedown="mousedown">
      <button @click="close">关闭</button>
      <button @click="minWin">缩小</button>
      <button @click="maxWin">放大</button>
    </div>
    <router-view></router-view>
  </div>
</template>

<script setup>
import { ref } from 'vue'
let isKeyDown = ref(false);
let dinatesX = ref(0);
let dinatesY = ref(0);

const mousedown = ( e )=>{
  console.log('2222');
  isKeyDown.value = true;
  dinatesX.value = e.x;
  dinatesY.value = e.y;

  document.onmousemove = (ev) => {
      if(isKeyDown.value){
        const x = ev.screenX - dinatesX.value;
        const y = ev.screenY - dinatesY.value;
        //给主进程传入坐标
        let data = {
            appX:x,
            appY:y
        }
        electron.ipcRenderer.invoke('custom-adsorption',data);

      }
  };
  document.onmouseup = (ev) => {
      isKeyDown.value = false
  };
  
}


//关闭
const close = ()=>{
  electron.ipcRenderer.invoke('close');
}
//缩小
const minWin = ()=>{
  electron.ipcRenderer.invoke('minWin');
}
//放大
const maxWin = ()=>{
  var isFull=!!(document.webkitIsFullScreen || document.mozFullScreen || 
    document.msFullscreenElement || document.fullscreenElement);
    if(  isFull  ){//缩小   
      if (document.exitFullscreen) {
          document.exitFullscreen();
        } else if (document.msExitFullscreen) {
          document.msExitFullscreen();
        } else if (document.mozCancelFullScreen) {
          document.mozCancelFullScreen();
        } else if (document.webkitExitFullscreen) {
          document.webkitExitFullscreen();
        }

    }else{//放大
      let element = document.documentElement;
      if (element.requestFullscreen) {
        element.requestFullscreen();
      } else if (element.msRequestFullscreen) {
        element.msRequestFullscreen();
      } else if (element.mozRequestFullScreen) {
        element.mozRequestFullScreen();
      } else if (element.webkitRequestFullscreen) {
        element.webkitRequestFullscreen();
      }
    }
}
</script>

<style>
*{margin:0;padding:0;}
.app{
  width: 100%;
  height: 50px;
  overflow: hidden;
  background: orange;
}
</style>